<template>
	<view class="body">
		<xk-header title="设备维修"></xk-header>
		<view class="list" >
			<view class="list-item header" @click="orderMore = !orderMore">
				<view>维修单号:  {{data.apply_no}}</view>
				<image v-if="!orderMore" src="/static/up.png"></image>
				<image v-else  src="/static/down.png"></image>
			</view>
			<view v-if="orderMore" class="data-item">
				<view class="order-info">
					<view class="info-item">
						<view class="key">设备信息：</view>
						<text style="word-break:break-all;">{{data.device_code}}-{{data.device_name}}</text>
					</view>
					<view class="info-item"><view class="key">故障描述：</view>{{data.repair_content}}</view>
					<view class="info-item"><view class="key">设备地址：</view>{{data.address || '-'}}</view>
					<view v-if="data.apply_image" class="info-item"><view class="key"></view>
						<image-list :pics="data.apply_image"></image-list>
					</view>
				</view>
			</view>
		</view>
		<view class="list" >
			<view class="list-item header">
				<view>维修处理</view>
			</view>
			<uni-data-picker placeholder="请选择维修类型" popup-title="维修类型" :localdata="types"
				@change="typeChange">
				<view class="list-item">
					<view>维修类型<text class="com-req"></text>:</view>
					<view :class="formInfo.repair_type_id ? 'right-title1' : 'right-title1 right-title1-empty'">{{formInfo.repair_type_id ? typeMap[formInfo.repair_type_id] : "请选择"}}</view>
					<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
				</view>
			</uni-data-picker>
			<view @click="editMate" class="list-item">
				<view>工单材料：</view>
				<view v-if="formInfo.dets.length > 0" class="right-title1" style="color: #2C72FF;">已添加{{formInfo.dets.length}}种物料</view>
				<view v-else class="right-title1" style="color: #2C72FF;">添加物料</view>
				<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
			</view>
			<!-- <biaofun-datetime-picker :defaultValue="defaultDate"
				start="2000-02-03 00:00"
				end="2200-10-28 23:59"
				fields="minute"
				@change="dealTimeChange"
			>
				<view class="list-item">
					<view>保修时间 ：</view>
					<view :class="formInfo.finish_time ? 'right-title1' : 'right-title1 right-title1-empty'">{{formInfo.finish_time ? formInfo.finish_time : "请选择"}}</view>
					<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
				</view>
			</biaofun-datetime-picker> -->
			<!-- <biaofun-datetime-picker :defaultValue="defaultDate"
				start="2000-02-03 00:00"
				end="2200-10-28 23:59"
				fields="minute"
				@change="dealTimeChange"
			>
				<view class="list-item">
					<view>完成时间 ：</view>
					<view :class="formInfo.finish_time ? 'right-title1' : 'right-title1 right-title1-empty'">{{formInfo.finish_time ? formInfo.finish_time : "请选择"}}</view>
					<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
				</view>
			</biaofun-datetime-picker> -->

			<picker mode="date" :value="formInfo.finish_time" @change="dealEndTimeChange">
				<view class="list-item">
					<view>完成时间<text class="com-req"></text>：</view>
					<view :class="formInfo.finish_time ? 'right-title1' : 'right-title1 right-title1-empty'">{{formInfo.finish_time ? formInfo.finish_time : "请选择"}}</view>
					<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
				</view>
			</picker>

			<!-- <uni-data-picker placeholder="请选择支付方" popup-title="支付方" :localdata="types"
						@change="typeChange">
				<view class="list-item">
					<view>支付方:</view>
					<view :class="formInfo.repair_type_id ? 'right-title1' : 'right-title1 right-title1-empty'">{{formInfo.repair_type_id ? typeMap[formInfo.repair_type_id] : "请选择"}}</view>
					<image mode="aspectFill" class="jiantou" src="/static/jiantou.png"/>
				</view>
			</uni-data-picker> -->
			<view class="list-item">
				<view>工作时长(小时)<text class="com-req"></text>：</view>
				<input class="input-item" type="digit" v-model="formInfo.work_time" placeholder="请输入工作时长" placeholder-class="placeholder"/>
			</view>
			<!-- <view class="list-item">
				<view>费用工时(小时)：</view>
				<input class="input-item" type="digit" v-model="formInfo.work_time" placeholder="请输入费用工时" placeholder-class="placeholder"/>
			</view>
			<view class="list-item">
				<view>结算金额(元)：</view>
				<input class="input-item" type="digit" v-model="formInfo.work_time" placeholder="请输入结算金额" placeholder-class="placeholder"/>
			</view> -->
			<view class="list-item textarea">
				<view>备注：</view>
				<textarea v-model="formInfo.record_remark" placeholder="在此输入备注" placeholder-class="placeholder"/>
			</view>
		</view>
		<view class="from-item upload-img-item" style="margin-top: 20rpx;">
			<view class="title">上传现场照片</view>
			<upload-image :images="formInfo.repair_image" @onChange="(images) => {formInfo.repair_image = images}"/>
		</view>
		<view class="common-bottom-view">
			<view class="common-btn" @click="doneRepair">提交</view>
		</view>
		<view class="common-zw"></view>
	</view>
</template>

<script>
	import moment from 'moment'
	export default {
		data() {
			return {
				orderMore: true,
				data: {},
				typeMap: {},
				typeIndex: -1,
				types:[],
				defaultDate: moment().format('YYYY-MM-DD HH:mm'),
				formInfo: {
					repair_id: '',
					repair_type_id: '',
					finish_time: '',
					work_time: '',
					repair_image: '',
					record_remark: '',
					isSubmit: true,
					dets:[]
				},
				notNull: {
					repair_id: "无法找到报修单号",
					repair_type_id: "请选择维修类型",
					finish_time: "请选择完成日期",
					work_time: "请输入工作时长",
				}
			};
		},
		onLoad(options) {
			this.repairId = options.repairId
			this.formInfo.repair_id = this.repairId
			this.getData();
		},
		methods:{
			getData(){
				this.$api.baseData_getPdDeviceRepair(this.repairId).then((res)=>{
					this.data = res.task
					this.initInfo()
				})
			},
			editMate(){
				uni.$off('getMateInfo')
				uni.$on('getMateInfo', (res)=>{
					this.formInfo.dets = res
				});
				uni.navigateTo({
					url: '/pagesA/facility-fix/facility-fix-material?mateList=' + JSON.stringify(this.formInfo.dets)
				})
			},
			initInfo() {
				let types = [[],[],[],[]]
				let typeMap = {}
				this.$api.baseData_getBaseRepairType().then(res => {
					console.warn("维修类型: ", res)
					for (let item of res) {
						typeMap[item.type_id] = item.type_name
						console.log(item.type_level, item)
						if(item.type_level){
							types[item.type_level - 1].push(item)
						}else{
							types[item.type_id.length / 4 - 1].push(item)
						}
					}
					let tt = this.initTypes(types, '', 1)
					this.types = tt
					this.typeMap = typeMap
					console.log('ttt', tt)
				})
			},
			initTypes(list, pid, level){
				let child = []
				for(let item of list[level - 1]){
					if (item.type_level > 3) continue	// 最多只能三级菜单
					if(item.type_id.startsWith(pid)){
						let cc = []
						if(level < 4){
							cc = this.initTypes(list, item.type_id, level + 1)
						}
						child.push({
							value: item.type_id,
							text: item.type_name,
							children: cc
						})
					}
				}
				return  child
			},
			dealEndTimeChange(e){
				// this.formInfo.end_time = moment(e.dt).format('YYYY-MM-DD HH:mm')
				this.formInfo.finish_time = e.detail.value
			},
			typeChange(res) {
				this.formInfo.repair_type_id = res[res.length - 1]
			},
			doneRepair(){
				for (let item in this.notNull) {
					if (!this.formInfo[item]) {
						this.$util.toast(this.notNull[item]);
						return;
					}
				}
				this.$util.confirm({
					content: "确定提交完成维修？",
					confirmText: "完成维修"
				}).then(isConfirm => {
					if (isConfirm) {
						this.$util.post({
							url: "app/pdDeviceRepair/register",
							data: this.formInfo
						}).then(res => {
							uni.$emit('refreshHomeDataList')
							uni.$emit('refreshDeviceRepair')
							uni.redirectTo({
								url: '/pagesA/facility-fix/facility-fix-finish?type=done'
							})
						})

					}
				})

			}
		}
	}
</script>

<style lang="scss" scoped>
@import '@/common/from.scss';

// .swiper-item{}
.result-item{
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding-bottom: 20rpx;
	.radio{
		display: flex;
		.r-item{
			display: flex;
			align-items: center;

			margin-right: 40rpx;
		}
	}
}




</style>
